<template>
	<view>
		<Navbar :backUrl="backUrl"></Navbar>
		<view v-if="newsData.weixin_url">
			<web-view :src="newsData.weixin_url"></web-view>
		</view>
		<view class="u-m-20" v-else>
			<view v-if="newsData.tpic">
				<u-image width="100%" height="400rpx" border-radius="20" :src="newsData.tpic"></u-image>
			</view>
			<view class="u-card-box u-m-t-30">
				<view class="u-font-30 u-font-bold u-text-line-15">{{newsData.title}}</view>
				<view class="u-flex u-row-between u-m-t-20">
					<view class="u-flex">
						<u-icon name="clock-fill" color="#888B9C" size="34"></u-icon>
						<view class="u-font-26 u-m-l-10 u-color-gray">{{newsData.create_time || '' }}</view>
					</view>
					<!-- <view class="u-flex">
						<u-icon name="eye-fill" color="#888B9C" size="34"></u-icon>
						<view class="u-font-26 u-m-l-10 u-color-gray">浏览量：{{newsData.view_number || ''}}</view>
					</view> -->
				</view>
			</view>
			<view class="u-card-box u-m-t-30">
				<view style="user-select:text !important;-webkit-user-select" :user-select="true">
					<u-parse class="pause_hid" :html="newsData.content" :selectable="true" :tag-style="style"
						:lazy-load="true"></u-parse>
				</view>
			</view>
			<view class="u-card-box u-m-t-30" v-if="newsData.file">
				<view class="u-font-bold u-font-30 u-color-puce u-p-b-20">附件</view>
				<view class="u-p-t-20 u-border-top">
					<view class="file_box u-flex u-row-between u-col-top" @click="onOpenFile()">
						<view class="u-m-r-20 u-flex-1 u-text-line-15">{{newsData.file_name}}</view>
						<u-icon name="file-text-fill" color="#CDCDCD" size="82"></u-icon>
					</view>
				</view>
			</view>
		</view>
		<view style="height: 200rpx;"></view>
		<Bottom ref="bottom" :isTwice="true" :rightText="'分享'" @confirm="onShare()"></Bottom>
		
		<!-- 分享 -->
		<Share :isShowShare="shareShow" :isMoment="false" @closeShare="shareShow = false"></Share>
	</view>
</template>

<script>
	import Navbar from '@/components/Navbar.vue'
	import Bottom from '@/components/Bottom.vue'
	import Share from '@/components/Share.vue'
	import share from '@/mixins/share.js'
	import { newsDetail } from '@/network/api.js'
	import { formatContent } from '@/utils/index.js'
	export default {
		mixins: [share],
		components:{
			Navbar,
			Bottom,
			Share
		},
		onLoad(options){
			uni.showLoading({
				title: "加载中"
			})
			this.onGetNewsDetail(options.id)
		},
		data(){
			return{
				backUrl: 'news',
				newsData: {},
				style: {
					div: 'padding: 0 !important',
					video: 'width: 100% !important'
				},
				shareShow: false
			}
		},
		methods:{
			onGetNewsDetail(id){
				newsDetail({news_id:id}).then(res=>{
					if(res.data.info.content){
						res.data.info.content = formatContent(res.data.info.content)
					}
					res.data.info.file = res.data.info.file[0] || ''
					res.data.info.file_name = res.data.info.file_name[0] || ''
					this.newsData = res.data.info
					this.mixinsShare.page = `/pages/newsDetail/newsDetail?id=${res.data.info.id}&inviterId=${uni.getStorageSync("user_id")}`
					this.mixinsShare.title = `${res.data.info.title}`
					this.mixinsShare.image = res.data.info.tpic || 'https://medv-new.oss-cn-shanghai.aliyuncs.com/images/common/20240624979559784584.png'
					uni.hideLoading()
				})
			},
			onShare(){
				this.shareShow = true
			},
			onOpenFile(){
				const _this = this
				wx.downloadFile({
					url: _this.newsData.file,
					filePath: wx.env.USER_DATA_PATH + `/${_this.newsData.file_name}`,
					success: function(res) {
						const filePath = res.filePath;
						uni.showLoading({
							title: '正在打开',
							mask: true
						})
						wx.openDocument({
							showMenu: true,
							filePath: filePath,
							success: function(res) {
								uni.hideLoading()
							},
							fail: function(err) {
								uni.hideLoading()
							}
						});
					},
					fail: function(err) {
						uni.hideLoading()
					}
				});
			}
		}
	}
</script>

<style scoped>
	.file_box{
		background: #f7f7f7;
		padding: 20rpx;
		border-radius: 10rpx;
	}
	
	video{
		width: 100% !important;
	}
</style>